function Fantu(obj,x,y) {
  var ft=this;
  ft.obj=obj;ft.x=x;ft.y=y;
  ft.cre();
}
Fantu.prototype.cre=function () {
  var ft=this;
  ft.pd=0;ft.col='';ft.ii=0;
  ft.arr=[];ft.ifrg=-1;
  ft.boxwh=70;
  ft.obj.style.height=ft.y*80-10+'px';
  ft.obj.style.width=ft.x*80-10+'px';
  ft.obj.style.margin='10px auto';
  ft.obj.style.position='relative';

  ft.arrbox=[];
  ft.arrbox2=[];
  ft.arrid=[];
  for(var fi=0;fi<ft.y;fi++){
    for(var fj=0;fj<ft.x;fj++){
      ft.arr.push(fi*ft.x+fj);

      var toRY=ft.crediv();
      toRY.style.top=80*fi+'px';
      toRY.style.left=80*fj+'px';
      toRY.style.transformStyle='preserve-3d';
      toRY.style.transition='all .6s';
      toRY.ic=fi*ft.x+fj;
      toRY.open=1;
      toRY.onclick=function () {
        if(this.open==1){
          this.open=0;
          ft.ifrg*=-1;
          this.style.transform='rotateY(180deg)';
          if(ft.ifrg==1){
            ft.arrid.push(this.childNodes[1].id);
            ft.arrbox.push(this);

          }else{
            if(ft.arrid[ft.arrid.length-1]!=this.childNodes[1].id){
              ft.arrbox2.push(this);
              var ab1=ft.arrbox.length-1;
              var ab2=ft.arrbox2.length-1;
              setTimeout(function () {
                ft.arrbox2[ab2].style.transform='rotateY(0deg)';
                ft.arrbox[ab1].style.transform='rotateY(0deg)';
                ft.arrbox2[ab2].open=1;
                ft.arrbox[ab1].open=1;
              },800);
            }
          }
        }
      };
      var toChi1=ft.crediv();
      toChi1.style.backgroundColor='#666';
     // toChi1.style.zIndex='10';
      toChi1.style.transform='translateZ(0px)';
      toRY.appendChild(toChi1);
      toRY.appendChild(ft.crediv());
      ft.obj.appendChild(toRY);
    }
  }
  for(var fi=0;fi<ft.x*ft.y;fi++){
    ft.setCol();
  }
};
Fantu.prototype.crediv=function () {
  var ft=this;
  var boxs=document.createElement('div');
  boxs.style.position='absolute';
  boxs.style.width=ft.boxwh+'px';
  boxs.style.height=ft.boxwh+'px';
  return boxs;
};
Fantu.prototype.setCol=function () {
  var ft=this;
  var oCNth=ft.ifSet();
  var cb=ft.obj.childNodes[oCNth].childNodes[1];
  if(ft.pd==0){
    var rr=ft.mathFR(255),rg=ft.mathFR(255),rb=ft.mathFR(255);
    ft.col='rgb('+rr+','+rg+','+rb+')';
    ft.pd=1;ft.ii=oCNth;
  }else{
    ft.pd=0;
  }
  cb.style.backgroundColor=ft.col;
  cb.style.transform='rotateY(180deg) translateZ(1px)';
  cb.id=ft.ii;
};
Fantu.prototype.mathFR=function (num) {
  return Math.floor(Math.random()*num);
};
Fantu.prototype.ifSet=function () {
  var ft=this;
  var ifnum=ft.arr[ft.mathFR(ft.arr.length)];
  for(var i in ft.arr){
    if(ft.arr[i]==ifnum){
      ft.arr.splice(i,1);
      return ifnum;
    }
  }
}
export default Fantu
